@media only screen and (min-width: 180px) and (max-width: 360px) {
    .brand a, .item-name{
        font-size: 9pt;
    }
    .item-name{
		font-size: 8pt;
    }
     .filter-data{
    	margin-top: 15px; 
    }


    #cluetip{
        width: 250px !important;
        left: 30px !important;
    }

    .tip-content img{
         max-height: 100px !important;
         max-width: 200px !important;
         display: block;
        margin: 0 auto;
    }
    .tip-content a.pull-left{
        display: block;
        float: none !important;
        margin-bottom: 10px;
        max-height: 100px !important;
    }
    #appForm .control-label{
        margin-left: -25px;
        float: left;
        width: 46%;
        font-size: 10px;
        font-weight: normal;
    }
    #appForm div.col-sm-4{
        width: 61.5% !important;
        float: left;
    }
    #appForm div.col-sm-4 input[type=text], #appForm div.col-sm-4 input#avatar, #appForm div.col-sm-4 input[type=password]{
        width: 160%;
    }
    #appForm div.col-sm-4 input#full_name{
        width: 134%;
    }
    #appForm #lblGroup{
        width: 110%;
    }
    #appForm #ckbGroup{
        margin-left: -17px !important;
        overflow: hidden;
    }
    #appForm #lbl_btn{
        display: none;
    }
    #appForm #area_button{
        width: 100%;
    }
    #appForm #area_button button{
        margin-right: 0px !important;
    }
    #appForm .form-group .col-xs-5, #appForm .form-group .col-xs-8{
        width: 78%;
    }
    #appForm .form-group .col-xs-5 input[type=text], #appForm .form-group .col-xs-5 input[type=password]{
        width: 120%;
    }
    #appForm .col-sm-9 #btn-bumit{
        margin-right: -10px;
    }
    #appForm .column-input-4{
        width: 100%;
    }
    #appForm .column-input-4 input,textarea{
        margin-left: -25px;
    }
    .fancybox-inner h4{
        font-size: 15px;
    }
    .fancybox-inner h5{
        font-size: 8px;
        font-weight: normal !important;
        width: 100%;
        margin: 0px;
        letter-spacing: 0px;
        color: #444;
        margin: 0px 0px 20px -10px !important;
    }
    .box h3{
        font-size: 12px;
        letter-spacing: 0px;
    }
    .has-feedback .form-control{
        padding-right: 10px;
    }
    .form-horizontal .checkbox{
        float: left;
        width: 50%;
    }
    .checkbox label{
        font-size: 9px;
    }
    .checkbox input[type="checkbox"]{
        width: 10px;
        height: 10px;
        margin-left: -13px;
        margin-top: 7px;
    }
    #wrap_sign{
        width: 65% !important;
    }
    #wrap_sign textarea{
        width: 148%;
        height: 100px;
    }
    .btn{
        font-size: 12px;
    }
    #des_event textarea{
        width: 159%;
        height: 70px;
    }
    #bg_color label{
        width: 68% !important;
    }
    #bg_color div.col-sm-4{
        width: 25% !important;
    }
    #fullname .col-sm-6{
        margin-left: -25px;
        width: 77% !important;
        padding-right: 0px;
    }
    #fullname #full_name_tagsinput{
        height: 70px;
        border-radius: 7px;
    }
    #event_title{
        word-break: break-word;
        font-size: 11px;
        letter-spacing: 1px;
    }
    #item_full_name{
        margin-left: -23px;
        width: 133% !important;
    }

    #load-about{
       left: 15px;
       font-size: 13pt;
    }
    #load-connect{
        right: 10px;
        font-size: 13pt;
    }
    .search-icon #btn-add-event{
        right: -18px;
        top: -1px;
    }
    .btn-add-item{
        top: -4px;
        left: -13px;
    }
    .btn-search-item{
        top: 0px;
        right: 20px;
    }
    .container{
        padding-left: 0px;
        padding-right: 0px;
    }
    .nav{
        font-size: 10px;
    }

    .nav li:last-child{
        width: 135px;
    }
    .nav > li > a {
        padding:10px;
        height: 50px;
    }
    .nav li:last-child a{
        padding:10px 0px;
    }
    .content-ul li{
        float: left;
        height: 50px;
    }
    .filter-data ul li.line{
        margin: 0 0 -4px;
    }
    .row-item{
        padding-left: 10% !important;
    }
    /*.row-item:nth-child(odd){
        padding-left: 12% !important;
    }*/
   /* .row-item{
        width: auto;
        padding-left: 8px !important;
    }

    .text-primary{
        width: auto;
    }*/
    /*.clearfix:before, .clearfix:after{
        display: inline;
    }*/
    #search_full_name{
        width: 218px;
    }
    .brand{
        padding: 10px 0 0;
        margin-bottom:-20px;
    }
    .row{
        width: 100%;
    }
    .search-icon a.adv{
        margin-right: -11px;
    }

}

@media only screen and (min-width : 360px) and (max-width: 440px) {
	.brand a{
        font-size: 14pt;
    }
    .filter-data{
    	margin-top: 20px; 
    }

    .item-name{
		font-size: 9pt;
    }

    #cluetip{
        width: 300px !important;
        left: 60px !important;
    }

    .tip-content img{
        max-height: 140px !important;
        max-width: 250px !important;
        display: block;
        margin: 0 auto;
    }
    .tip-content a.pull-left{
        display: block;
        float: none !important;
        margin-bottom: 10px;
        max-height: 140px !important;
    }

    .btn-add-item{
        top: 0px;
    }
    .btn-search-item{
        top: 0px;
        right: 20px;
    }


}

@media only screen and (min-width : 440px) and (max-width : 760px){
	/*#appForm .has-feedback:first-of-type .form-control{
		margin-left: 15px;
		width: 235px;
	}*/
	#appForm .has-feedback .form-control{
    	margin-left: 0px;	
    }

    #cluetip{
        width: 350px !important;
        left: 60px !important;
    }

    .tip-content img{
         max-height: 140px !important;
         max-width: 250px !important;
         display: block;
        margin: 0 auto;
    }
    .tip-content a.pull-left{
        display: block;
        float: none !important;
        margin-bottom: 10px;
        max-height: 140px !important;
    }
    #appForm .control-label{
        width: 35%;
    }
    #appForm #area_button{
        width: 70%;
    }
    #appForm .col-xs-8{
        width: 100%;
    }
    #appForm .col-sm-9 #btn-bumit{
        margin-right: 15px;
    }

    .row-item{

        padding-left: 18% !important;
    }
    /*.text-primary{
        width: auto;
    }*/
    .form-control{
        width: 175px;
    }
    .form-horizontal .checkbox{
        float: left;
        width: 50%;
    }
    #appForm #lblGroup{
        width: 110%;
    }

    .appFormSearch div.col-sm-4 input#full_name{
        width: 175px;
        margin-left: 5px;
    }
    .appFormSearch .control-label{
        margin-left: -25px;
        float: left;
        width: 46%;
        font-weight: normal;
    }
    .appFormSearch div.col-sm-4 {
        float: left;
        width: 61.5% !important;
    }

    .row{
        width: 100%;
    }
    .box{
        width: 100%;
    }
    .form-group{
        width: 100%;
    }
    .fancybox-inner h5{
        font-weight: normal !important;
        width: 100%;
        margin: 0px;
        letter-spacing: 0px;
        color: #444;
        margin: 0px 0px 20px -10px !important;
    }
}

@media only screen and (min-width : 767px) and (max-width : 980px){
	#appForm .has-feedback:first-of-type .form-control{
		margin-left: 0px;
	}

	#appForm .has-feedback .form-control{
    	margin-left: -11px;	
    }
    #appForm .form-group #btn-bumit{
    	margin-right: 10px;
    }
    #cluetip{
        width: 450px !important;
    }
    #appForm .frm-input .clr{
        display: none
    }
}

@media only screen and (min-width : 980px){
    #appForm .frm-input .clr{
        display: none
    }
    .bg-blue{
        padding-top: 10px;
    }
}

@media only screen and (max-width : 980px){
    .bg-blue{
        padding-top: 10px;
    }
}